// @ts-nocheck
import React, {useState} from 'react'
import {Designer, MainPanel, ViewPanel, ViewportPanel, Workspace, WorkspacePanel,} from '@designable/react'
import {createDesigner, GlobalRegistry, KeyCode, Shortcut,} from '@designable/core'
import {ActionsWidget, LogoWidget, PreviewWidget} from './widgets'
import {saveSchema} from '../design/service'
import 'antd/dist/antd.less'

export const previewProvider = React.createContext<any>({})

GlobalRegistry.registerDesignerLocales({
    'zh-CN': {
        sources: {
            Inputs: '输入控件',
            Layouts: '布局组件',
            Arrays: '自增组件',
            Displays: '展示组件',
        },
    },
    'en-US': {
        sources: {
            Inputs: 'Inputs',
            Layouts: 'Layouts',
            Arrays: 'Arrays',
            Displays: 'Displays',
        },
    },
})
const SaveShortCut = new Shortcut({
    codes: [
        [KeyCode.Meta, KeyCode.S],
        [KeyCode.Control, KeyCode.S],
    ],
    handler(ctx) {
        saveSchema(ctx.engine)
    },
})

const engine = createDesigner({
    shortcuts: [SaveShortCut],
})

const App = () => {
    const [tableName, setTableName] = useState('')
    React.useEffect(async () => {
    }, [])

    const submit = (submitForm) => {
        // update(defaultTable, tableName, schema, formId)
    }

    const value = {
        setTableName,
        tableName
    }
    return (
        <previewProvider.Provider value={value}>
            <Designer engine={engine}>
                <MainPanel logo={<LogoWidget/>} actions={<ActionsWidget/>}>
                    <Workspace id="form">
                        <WorkspacePanel>
                            <ViewportPanel>
                                <ViewPanel type="PREVIEW">
                                    {(tree) => <PreviewWidget tree={tree} submit={submit}/>}
                                </ViewPanel>
                            </ViewportPanel>
                        </WorkspacePanel>
                    </Workspace>
                </MainPanel>
            </Designer>
        </previewProvider.Provider>
    )
}

export default App;
